import 'package:boss/main.dart';
import 'package:boss/textStyle/text_style.dart';
import 'package:boss/ui/widget/button/fixed_bottom_btn.dart';
import 'package:boss/ui/widget/center_title_app_bar.dart';
import 'package:boss/ui/widget/custom_divier.dart';
import 'package:boss/ui/widget/loading/loading.dart';
import 'package:boss/ui/widget/number_editer.dart';
import 'package:boss/ui/widget/shadow_radius_card.dart';
import 'package:flutter/material.dart';
import 'package:hi_common/hi_common.dart';
import 'package:router/annotation.dart';

@RouterConfig(PayQrApplyPage.pageName)
class PayQrApplyPage extends StatefulWidget {
  static const pageName = '/PayQrApplyPage';

  @override
  _PayQrApplyPageState createState() => _PayQrApplyPageState();
}

class _PayQrApplyPageState extends BaseState<PayQrApplyPage> {
  _PayQrApplyPageState() : super(PayQrApplyPage.pageName);

  String describe = '';

  int count = 1;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CenterTitleAppBar(title: '收款码申请'),
      body: Column(
        children: [
          Expanded(
            child: SingleChildScrollView(
              padding: EdgeInsets.symmetric(horizontal: 20.w),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  ShadowRadiusCard(
                    padding: EdgeInsets.all(30.w),
                    margin: EdgeInsets.only(left: 20.w, right: 20.w, top: 30.w),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Row(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text('输入申请收款码个数', style: TextStyleConstant().normal_1_28),
                                Container(
                                  child: Text('同门店最大不能超过5个', style: TextStyleConstant().normal_1_28),
                                  margin: EdgeInsets.only(top: 25.w),
                                ),
                              ],
                            ),
                            NumberEditer(
                              value: count,
                              maxValue: 5,
                              minValue: 1,
                              onChanged: (value) {
                                setState(() {
                                  count = value;
                                });
                              },
                            ),
                          ],
                        ),
                        Container(
                          child: Text('备注信息', style: TextStyleConstant().normal_1_28),
                          margin: EdgeInsets.only(top: 44.w),
                        ),
                        Container(
                          height: 50.w,
                          margin: EdgeInsets.only(top: 25.w),
                          child: TextField(
                            style: TextStyleConstant().normal_1_28,
                            decoration: InputDecoration(
                              contentPadding: EdgeInsets.zero,
                              hintText: '文字数目不超过20字，例如：西区使用',
                              hintStyle: TextStyleConstant().normal_4_28,
                              isDense: true,
                              border: NoInputBorder(),
                              focusedErrorBorder: NoInputBorder(),
                              focusedBorder: NoInputBorder(),
                              errorBorder: NoInputBorder(),
                              enabledBorder: NoInputBorder(),
                              disabledBorder: NoInputBorder(),
                            ),
                            onChanged: (value) {
                              describe = value;
                            },
                          ),
                        ),
                        CustomDivider(),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
          FixedBottomBtn(
            title: '确认生成',
            onTap: () async {
              if (describe.length > 20) {
                toast('备注不能超过20个字');
                return;
              }

              try {
                showLoadingToast();

                final res = await api.applyPayQrCode(describe, count);

                if (!res.successful()) {
                  toast(res.msg);
                  return;
                }

                toast('申请成功');

                Navigator.pop(context);
              } catch (e) {
                toast(e.toString());
              } finally {
                hideLoadingToast();
              }
            },
          ),
        ],
      ),
    );
  }
}
